<template>
  <span style="font-size: 16px;color: lawngreen">今日已看诊{{ number }}人</span>
      &nbsp;&nbsp;&nbsp;&nbsp;
  <span style="font-size: 16px;color: red">当前有{{ total }}人排队</span>
  <hr/>
  <div style="text-align: left">患者叫号</div>
  <hr/>

  <el-form :inline="true"  :model="formReg">
    <el-form-item label="病历号">
      <el-input  placeholder="请输入患者病历号" clearable  v-model="formReg.caseNumber"/>
    </el-form-item>
    <el-form-item label="患者姓名">
      <el-input  placeholder="请输入患者姓名" clearable v-model="formReg.realName"/>
    </el-form-item>
    <el-form-item>
      <el-button type="success" @click="getRegisterList02">查询</el-button>
    </el-form-item>

  </el-form>
  <hr/>
  <el-table :data="regList" style="width: 100%">
    <el-table-column prop="id" label="编号" />
    <el-table-column prop="caseNumber" label="病历号"/>
    <el-table-column prop="realName" label="患者姓名" />
    <el-table-column label="操作" >
      <template #default="{ row }">
      <el-button type="primary" round @click="openRegister(row)">创建病历</el-button>
      <el-button type="success" round>跳过</el-button>
      <el-button type="info" round>叫号</el-button>
      </template>

    </el-table-column>
  </el-table>
  <hr/>
  <!-- 分页插件 -->
  <div class="example-pagination-block">
    <el-pagination layout="prev, pager, next" :total="total" />
  </div>
</template>

<script setup>

import {onMounted, reactive, ref} from "vue";
import axios from "axios";
import router from "@/router";
import {ElMessage} from "element-plus";
  //定义列表数据
  const regList=ref([])
  const total=ref();
  const number=ref();
  //页面挂载发生ajax请求
  onMounted(()=>{
    getRegisterList();
    getCountRegister();
  })
  //定义表单数据
  const formReg=reactive({
    caseNumber:'',
    realName:''
  });
/*发送加载某个医生当前需要接诊的病人列表的请求*/
function getRegisterList(){
  axios.get("http://localhost/his/registerList")
      .then((response)=>{
        regList.value=response.data.registerList;
        total.value=response.data.total;
      })
      .catch((error)=>{
        console.log(error);
      });
}
/*发送加载某个医生当前已经接诊的病人数量的请求*/
function getCountRegister(){
  axios.get("http://localhost/his/countRegister")
      .then((response)=>{
        //console.log(response);
        number.value=response.data;
      })
      .catch((error)=>{
        console.log(error);
      });
}
/*发送请求，根据病历号或者病人信息查询挂号信息*/
function getRegisterList02(){
  let url="http://localhost/his/registerList?caseNumber="
      +formReg.caseNumber+"&realName="+formReg.realName;
  axios.get(url)
      .then((response)=>{
        regList.value=response.data.registerList;
        total.value=response.data.total;
      })
      .catch((error)=>{
        console.log(error);
      });
}
function openRegister(row){
  //router.push({path:"/HomeMedicalRecord",query:{id:row.id}});
  //发送ajax请求修改病历状态
  let url="http://localhost/his/updateVisitState?id="
      +row.id+"&state=2";
      axios.get(url)
      .then((response)=>{
          ElMessage(response.data.msg);
        getRegisterList();//更新当前医生需要接诊的病人列表
        getCountRegister();//更新当前医生已经接诊人数

      })
      .catch((error)=>{
        console.log(error);
      });

  // 设置sessionStorage，保存当前选中的记录的id
  sessionStorage.setItem('sessionData', JSON.stringify({id:row.id}))
}
</script>

<style scoped>

</style>